<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/page/inc/taglib.jsp"%>
<%
	String path = request.getContextPath();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>样例管理后台</title>
<jsp:include page="inc/dwz.jsp" />
<!--  额外的引入  -->
<link rel="stylesheet" href="${pageContext.request.contextPath}/statics/swiper-4.4.1/dist/css/swiper.min.css">
<script src="${pageContext.request.contextPath}/statics/swiper-4.4.1/dist/js/swiper.min.js"></script>
<script src="${pageContext.request.contextPath}/statics/MessagePlugin/js/message.js"></script>
<link rel="stylesheet" href="${pageContext.request.contextPath}/statics/MessagePlugin/css/message.css">
</head>
<body scroll="no">
	<div id="layout">
		<div id="header">
			<!-- navMenu begin -->
			<div class="headerNav">
				<%-- <img alt="" src="${pageContext.request.contextPath}/statics/images/logo.png" height="50" /> --%>
				<ul class="nav">
					<li style="color: white;">欢迎您（${sessionScope.exampleuser.employeeName}）！&nbsp;当前时间： <span id="time"></li>
					<li><a href="javascript:" style="color: black;">${userNo}</a></li>
					<!-- 	<li><a href="pms_userViewOwnInfo.action" target="dialog" width="500" height="400" style="color: #fff;">帐号信息</a></li>
                	<li><a href="pms_userChangeOwnPwdUI.action" target="dialog" width="550" height="300" style="color: #fff;">修改密码</a></li> -->
					<%--   <li><a href="logout" title="退出登录确认" width="300" height="200" style="color: #fff;">退出</a></li>--%>
					<li><a href="${pageContext.request.contextPath}/system/merchantEmployees/toChangeInfo" target="dialog" width="500" height="400" style="color: #fff;">帐号信息</a></li>
					<li><a href="${pageContext.request.contextPath}/system/merchantEmployees/toChangePassword" target="dialog" width="550" height="300" style="color: #fff;">修改密码</a></li>
					<li><a href="${pageContext.request.contextPath}/toLogout" target="dialog" width="300" height="200" mask="true" style="color: #fff;">退出</a></li>
				</ul>
				<!-- <ul class="themeList" id="themeList">
					<li theme="default">
						<div class="selected">蓝色</div>
					</li>
					<li theme="green">
						<div>绿色</div>
					</li>
					<li theme="purple">
						<div>紫色</div>
					</li>
					<li theme="silver">
						<div>银色</div>
					</li>
					<li theme="azure">
						<div>天蓝</div>
					</li>
				</ul> -->
			</div>
			<!-- navMenu end -->

		</div>

		<div id="leftside">
			<div id="sidebar_s">
				<div class="collapse">
					<div class="toggleCollapse">
						<div></div>
					</div>
				</div>
			</div>
			<div id="sidebar">
				<div class="toggleCollapse">
					<h2>主菜单</h2>
					<div>收缩</div>
				</div>

				<div class="accordion" fillSpace="sidebar">
					<!-- 迭代一级菜单 -->
					<%-- <c:forEach items="${sessionScope.examplemenu }" var="menu1">
                    <c:if test="${ menu1.level==1}">
                        <div class="accordionHeader">
                            <h2>
                                <span>Folder</span>${menu1.name }
                                <a href="${pageContext.request.contextPath}/system/tpRole/list" target="navTab" rel="${pageContext.request.contextPath}/system/tpRole/list" fresh="true">/system/tpRole/list</a>
                            </h2>
                        </div>
                        <div class="accordionContent">
                            <ul class="tree treeFolder">
                                <!-- 迭代二级菜单 -->
                                <c:forEach items="${sessionScope.examplemenu }" var="menu2">
                                    <c:if test="${ menu2.level==2 && menu1.id==menu2.pid}">
                                        <li><a href="${pageContext.request.contextPath}${menu2.url }" target="navTab" rel="${pageContext.request.contextPath}${menu2.url }" fresh="true">${menu2.name }</a></li>
                                    </c:if>
                                </c:forEach>
                            </ul>
                        </div>
                    </c:if>
                </c:forEach> --%>

					<%-- <div class="accordionHeader">
						<h2>
							<span>Folder</span>系统管理
						</h2>
					</div>
					<div class="accordionContent">
						<ul class="tree treeFolder">
							<li><a href="${pageContext.request.contextPath}/system/merchantEmployees/list" target="navTab" rel="${pageContext.request.contextPath}/system/merchantEmployees/list" fresh="true">员工管理</a></li>
							<li><a href="${pageContext.request.contextPath}/system/role/list" target="navTab" rel="${pageContext.request.contextPath}/system/role/list" fresh="true">角色管理</a></li>
							<li><a href="${pageContext.request.contextPath}/system/permission/list" target="navTab" rel="${pageContext.request.contextPath}/system/permission/list" fresh="true">权限管理</a></li>
						</ul>
					</div> --%>
				</div>
			</div>
		</div>
		<div id="container">
			<div id="navTab" class="tabsPage">
				<div class="tabsPageHeader">
					<div class="tabsPageHeaderContent">
						<ul class="navTab-tab">
							<li tabid="main" class="main"><a href="javascript:;"><span><span class="home_icon">主页</span></span></a></li>
						</ul>
					</div>
					<div class="tabsLeft">left</div>
					<div class="tabsRight">right</div>
					<div class="tabsMore">more</div>
				</div>
				<ul class="tabsMoreList">
					<li><a href="javascript:;">主页</a></li>
				</ul>
				<div class="navTab-panel tabsPageContent layoutBox">
					<div class="page unitBox">
						<div layoutH="0">
							<div class="row">
								<div class="col-md-6 col-sm-12">

									<div class="panel collapse" defH="150">
										<h1></h1>
										<div style="padding-left: 40px;">
											<span style="font-size: 20px; position: absolute; padding: 20px 0px;">第${loginlog.frequency}次登陆</span> <br /> <span style="font-size: 30px; position: absolute; padding: 50px 0px;">欢迎使用孟思罗企业管理系统</span>
										</div>
									</div>

								</div>
								<div class="col-md-6 col-sm-12">

									<div class="panel collapse" defH="150">
										<h1></h1>
										<div style="padding-left: 40px;">
											<span style="font-size: 25px; position: absolute; padding: 20px 0px">上次登陆时间：<fmt:formatDate value="${loginlog.loginTime}" type="date" dateStyle="full"  pattern="yyyy-MM-dd"/></span> <br /> <span style="font-size: 25px; position: absolute; padding: 50px 0px">上次登陆IP：${loginlog.ip}</span>
										</div>
									</div>

								</div>
							</div>
							<div class="row">
								<div class="col-md-6 col-sm-12">

									<div class="panel collapse" defH="510">
										<h1></h1>
										<div>
											<table style="width: 100%; padding: 10px 0px; padding-left: 10px; box-shadow: 0 0 2px #000000; border-radius: 10px">
												<tr>
													<td style="left: 0; font-size: 25px"><span>&nbsp;</span>公司公告</td>
													<td style="text-align: right; font-size: 25px; padding-right: 10px"><shiro:hasPermission name="/bulletin/bulletin/list">
															<a href="${pageContext.request.contextPath}/bulletin/bulletin/list" title="公司公告" style="font-size: 25px;" fresh="true" target="navTab" rel="${pageContext.request.contextPath}/bulletin/bulletin/list"> <i class="fa fa-angle-double-right"></i>
															</a>
														</shiro:hasPermission></td>
												</tr>
											</table>
											<table style="width: 100%; padding: 10px 0px; padding-left: 10px; padding: 5px 0px; border-spacing: 0px 5px; border-collapse: separate; border-spacing: 0px 12px;">
												<c:forEach items="${requestScope.record}" var="item" varStatus="status">
													<tr style="box-shadow: 0 0 2px #000000; border-radius: 10px; font-size: 20px;" onclick="bulletinDetails('${item.id}')">
														<td style="width: 25px; padding: 10px 10px">${status.count }</td>
														<td style="left: 0;">${item.title }</td>
														<td style="text-align: right; padding-right: 10px"><fmt:formatDate value="${item.releaseTime }" type="date" dateStyle="long"  pattern="yyyy-MM-dd"/></td>
													</tr>
												</c:forEach>
											</table>
										</div>
									</div>

								</div>
								<style>
.container {
	display: flex;
	flex-flow: column nowrap;
	width: 100%; /*任意改变长宽*/
	height: 95%;
}

.parent {
	display: flex;
	flex-flow: row nowrap;
	flex: 1 1 0; /*元素弹性*/
	text-align: center;
	padding: 0px 20px;
}

.container .parent:first-child {
	margin-bottom: 10px;
}

.item {
	flex: 1 1 0; /*元素弹性*/
	color: #000000;
	font-size: 20px;
	line-height: 200px;
	border: 1px solid #000000;
}

.parent .item:first-child {
	margin-right: 10px;
}
</style>

								<div class="col-md-6 col-sm-12">

									<div class="panel collapse" defH="510">
										<h1></h1>
										<div>
											<table style="border: 1px solid #ffffff; width: 98%; padding: 10px 0px; padding-left: 10px; color: #000000; margin-left: 2%; border-radius: 10px">
												<tr>
													<td style="left: 0; font-size: 25px"><span>&nbsp;</span>常用功能</td>
													<td style="text-align: right; font-size: 25px; padding-right: 20px"><shiro:hasPermission name="/system/role/list">
															<a title="角色管理" style="font-size: 25px;" href="${pageContext.request.contextPath}/system/role/list" rel="${pageContext.request.contextPath}/system/role/list" target="navTab"> <i class="fa fa-cog"></i>
															</a>
														</shiro:hasPermission></td>
												</tr>
											</table>
											<br>
											<!--  确定滑动的容器 -->
											<div class="swiper-container " style="width: 100%; height: 86%">
												<!-- 滑动的管理器 -->
												<div class="swiper-wrapper " style="width: 100%; height: 86%">
													<c:forEach items="${requestScope.commonles}" varStatus="statusBig">
														<c:if test="${statusBig.index%4==0 }">
															<!--  滑动模块1  -->
															<div class="swiper-slide" style="width: 100%; height: 100%;">
																<div class="row" style="height: 100%; width: 98%; padding: 0px 15px">
																	<c:forEach items="${requestScope.commonles}" var="item" varStatus="status">
																		<c:if test="${statusBig.index+4 > status.index && statusBig.index <= status.index}">
																			<a title="${item.name }" rel="${pageContext.request.contextPath}${item.url }" target="navTab" href="${pageContext.request.contextPath}${item.url }">
																				<div class="col-md-3 col-sm-12" style="width: 45%; height: 43%; margin: 2.5%; border: 1px solid #000000; text-align: center; display: flex; border-radius: 10px;">
																					<span style="font-size: 20px; margin: auto;">${item.name }</span>
																				</div>
																			</a>
																		</c:if>
																	</c:forEach>
																</div>
															</div>
														</c:if>

													</c:forEach>

												</div>
												<!-- 滑动的管理器-end  -->

												<!-- 分页器  -->
												<div class="swiper-pagination"></div>


											</div>

										</div>
									</div>

								</div>
							</div>
						</div>
					</div>

				</div>
			</div>
		</div>

	</div>

	<div id="footer">Copyright &copy; 2017 JKOSS</div>

</body>
<script type="text/javascript">
	//创建一个日期对象
	function show() {
		var d = new Date();
		//获取年份
		//var nian=d.getYear();//2016  //16
		var nian = d.getFullYear();//2016
		//获取月
		var yue = d.getMonth() + 1;//6   july 7月   0-11
		//获取星期几
		var xq = d.getDay();//5    0-6    0:星期天
		//获取几号
		var dd = d.getDate();//1    1-31
		//获取小时
		var h = d.getHours();// 16下午4点     24小时制
		//获取分钟
		var m = d.getMinutes();//31分
		//获取描述
		var s = d.getSeconds();//50秒
		document.getElementById("time").innerHTML = nian + "-" + yue + "-" + dd + " " + h + ":" + m + ":" + s;
	}

	setInterval("show()", 1000);

	//菜单迭代
	//var menus = ${sessionScope.examplemenu};
	var menus = ${sessionScope.examplemenu};
	var path = "${pageContext.request.contextPath}";
	//父菜单
	function pmenu(menus) {
		//console.log(menus);
		var pmenuhtml = "";
		for (var i = 0; i < menus.length; i++) {
			pmenuhtml += "<div class='accordionHeader'>" + "	<h2>" + "		<span>Folder</span>" + menus[i].name
			//+"		<a href='${pageContext.request.contextPath}/system/tpRole/list' target='navTab' rel='${pageContext.request.contextPath}/system/tpRole/list' fresh='true'>/system/tpRole/list</a>"
			+ "	</h2>" + "</div>"
			var submenu = menus[i].submenu;
			if (submenu) {
				pmenuhtml += "<div class='accordionContent'>"
				pmenuhtml += subMenu(menus[i]);
				pmenuhtml += "</div>"
			}

		}
		$(".accordion").html(pmenuhtml);
	}
	//子菜单
	function subMenu(menu) {
		var submenu = menu.submenu;
		//console.log(submenu);
		if (submenu) {
			var submenuhtmls = "";
			//控制树的li显示
			for (var i = 0; i < submenu.length; i++) {
				if (submenu[i].type != 2) {

					var href = "";
					var rel = "";
					if (submenu[i].type == 1) {
						href = "href='" + path + submenu[i].url + "' rel='" + path + submenu[i].url + "' target='navTab' fresh='true'";
					}
					submenuhtmls += "		<li><a "+href+"><i class='"+submenu[i].icon+"'></i>" + submenu[i].name + "</a>"
					var subMenus = subMenu(submenu[i]);
					if (subMenus) {
						submenuhtmls += subMenus;
					}
					submenuhtmls += "</li>"
				}
			}
			//控制树的ul显示
			var submenuhtml = "";
			var submenuhtmlhead = "";
			var submenuhtmltail = "	</ul>";
			if (submenu[0].level == 2) {
				submenuhtmlhead = "	<ul class='tree'>";
			} else {
				submenuhtmlhead = "	<ul>";
			}
			//submenuhtml += submenuhtmls + "	</ul>"

			if (submenuhtmls) {
				submenuhtml = submenuhtmlhead + submenuhtmls + submenuhtmltail;
			}

			return submenuhtml;
		}
	}
	$(function() {
		//熏染菜单
		pmenu(menus);
	})
	
	var mySwiper = new Swiper('.swiper-container', {
		direction : 'horizontal', // 垂直切换选项
		loop : ${fn:length(requestScope.commonles)>4}, // 循环模式选项
		spaceBetween : 30,
		slidesPerView :1,
		breakpoints: { 
			 1024: {
		      width: 363,
		    } ,
			 1280: {
		      width: 491,
		    } ,
			 1366: {
		      width: 534,
		    } ,
			 1366: {
		      width: 534,
		    } ,
			 1400: {
		      width: 551,
		    } ,
			 1400: {
		      width: 551,
		    } ,
			 1440: {
		      width: 571,
		    } ,
			 1600: {
		      width: 651,
		    } ,
			 1680: {
		      width: 691,
		    } ,
		     1920: {
		      width: 811,
		    } ,
		  },
		// 如果需要分页器
		pagination : {
			el : '.swiper-pagination',
			/* 分页器开关*/
			clickable : true,
		},

	/*   // 如果需要前进后退按钮
	 navigation: {
	 nextEl: '.swiper-button-next',
	 prevEl: '.swiper-button-prev',
	 },
	 // 如果需要滚动条
	 scrollbar: {
	 el: '.swiper-scrollbar',
	 },*/
	})

	function bulletinDetails(id) {
		$.pdialog.open("${pageContext.request.contextPath}/bulletin/bulletin/details?id=" + id, "bulletinDetails", "详情", {
			width : 1400,
			height : 800,
			mask : true,
			resizable : true,
			drawable : false
		});
	}
	//双击打开详情弹框
	function openDetailsDialog(obj){
		var detailsBtn = $(obj).find('td:last').find('.detailsBtn:first');
		var url = detailsBtn.attr("href");
		var dlgId = url.substr(0,url.indexOf('?'));
		$.pdialog.open(url, dlgId, "详情", {
			width : 1400,
			height : 800,
			mask : true,
			resizable : true,
			drawable : false
		});
	}
	//双击打开详情页面
	function openDetailsNavTab(obj){
		var detailsBtn = $(obj).find('td:last').find('.detailsBtn:first');
		var url = detailsBtn.attr("href");
		var tabid = url.substr(0, url.indexOf('?'));
		var title = detailsBtn.find('span').html();
		navTab.openTab(tabid, url, { title:title, fresh:false, data:{} });
	}
</script>
</html>